<template>
    <div class="screen_block_box">
        <h2 class="header">消息列表</h2>
        <div class="table">
            <div class="table_row table_header flex-row">
                <span class="user">人员</span>
                <span class="msg">消息</span>
                <span class="time">时间</span>
                <span class="type">类型</span>
            </div>
            <div class="table_row table_item flex-row" v-for="item in list" :key="item.notifyLogId">
                <span class="user">{{item.createBy}}</span>
                <span class="msg">
                    <a-popover placement="top">
                        <template #content>
                            <p>{{item.notifyMsg}}</p>
                        </template>
                       {{item.notifyMsg}}
                    </a-popover>
                </span>
                <span class="time">{{item.updateTime}}</span>
                <span class="type">
                    <field-tag
                        :value="item.alarmType"
                        type="value"
                        showType="label"
                        :key="item.notifyLogId"
                        :data="alarmTypes"
                    ></field-tag>
                </span>
            </div>
            
        </div>
    </div>
</template>
<script>
import { mapState } from 'vuex';
import {remoteNotifyList} from '@/api/home'
export default {
    name:"NewsList",
    data(){
        return{
            form:{
                page:1,
                size:10,
                userId:''
            },
            list:[],
            alarmTypes:[
                { label: '上限报警', value: 'A' },
                { label: '上上限报警', value: 'B' },
                { label: '下限报警', value: 'C' },
                { label: '下下限报警', value: 'D' },
            ]
        }
    },
    computed: {
        ...mapState({
            accountInfo: state => state.user.accountInfo
        })
    },
    created(){
        let {userId} = this.accountInfo;
        this.form.userId = userId;
        this.getList()
    },
    methods:{
        async getList(){
            let res = await remoteNotifyList(this.form);
            let {list} = res.data;
            this.list = list;
        }
    }
}
</script>